<template>
    <view>
        <view v-if="!isLoad" class="margin-top load loading text-l text-grey"></view>

        <view class="main-admin" v-if="isAdmin && isLoad">
            <view class="form-box shadow">
                <view class="form-group">
                    <view class="title">地址：</view>
                </view>
                <view class="form-group">
                    <textarea placeholder="填写地址" placeholder-class="phc" v-model="formAddress" maxlength="200" :focus="formAddressFocus" :auto-height="true"></textarea>
                </view>
                <view v-if="formAddressFocus" class="hint-desc error">{{ formAddressFocus }}</view>

                <view class="form-group">
                    <view class="title">电话：</view>
                </view>

                <view class="form-group">
                    <textarea placeholder="填写电话" placeholder-class="phc" v-model="formPhone" maxlength="50" :focus="formPhoneFocus" :auto-height="true"></textarea>
                </view>
                <view v-if="formPhoneFocus" class="hint-desc error">{{ formPhoneFocus }}</view>

                <cmpt-img-upload
                    :isShowSize="false"
                    title="客服二维码图片 (微信，企业微信等）："
                    imgMax="8"
                    :imgList="formServicePic"
                    :isCheck="false"
                    @upload="bindUploadCmpt($event, { item: 'formServicePic' })"
                    data-item="formServicePic"
                />

                <cmpt-img-upload
                    :isShowSize="false"
                    title="官微二维码图片 (公众号，微博等）："
                    imgMax="8"
                    :imgList="formOfficePic"
                    :isCheck="false"
                    @upload="bindUploadCmpt($event, { item: 'formOfficePic' })"
                    data-item="formOfficePic"
                />
            </view>

            <button @tap="bindFormSubmit" class="btn-admin margin-top-xl">提交</button>
        </view>
    </view>
</template>

<script>
import cmptImgUpload from '../../../../cmpts/public/img/img_upload_cmpt';
const AdminBiz = require('../../../../biz/admin_biz.js');
const pageHelper = require('../../../../helper/page_helper.js');
const cloudHelper = require('../../../../helper/cloud_helper.js');
const validate = require('../../../../helper/validate.js');
const setting = require('../../../../setting/setting.js');
export default {
    components: {
        cmptImgUpload
    },
    data() {
        return {
            isLoad: false,
            formServicePic: '',
            formOfficePic: '',
            formAddress: '',
            formPhone: '',
            isAdmin: '',
            formAddressFocus: [],
            formPhoneFocus: []
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: async function (options) {
        if (!AdminBiz.isAdmin(this)) {
            return;
        }
        this.loadDetailFun();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: async function () {
        await this.loadDetailFun();
        uni.stopPullDownRefresh();
    },
    methods: {
        loadDetailFun: async function () {
            if (!AdminBiz.isAdmin(this)) {
                return;
            }
            let opts = {
                title: 'bar'
            };
            let setup = await cloudHelper.callCloudData('home/setup_all', {}, opts);
            if (!setup) {
                return;
            }
            this.setData({
                isLoad: true,
                // 表单数据
                formServicePic: setup.SETUP_SERVICE_PIC,
                formOfficePic: setup.SETUP_OFFICE_PIC,
                formAddress: setup.SETUP_ADDRESS,
                formPhone: setup.SETUP_PHONE
            });
        },

        bindUploadCmpt: function (e, _dataset) {
            /* ---处理dataset begin--- */
            this.handleDataset(e, _dataset);
            /* ---处理dataset end--- */
            let item = pageHelper.dataset(e, 'item');
            this.setData({
                [item]: e.detail
            });
        },

        /**
         * 数据提交
         */
        bindFormSubmit: async function () {
            if (!AdminBiz.isAdmin(this)) {
                return;
            }
            let data = this;

            // 数据校验
            let rules = {
                address: 'formAddress|name=地址',
                phone: 'formPhone|name=电话'
            };
            data = validate.check(data, rules, this);
            if (!data) {
                return;
            }
            try {
                // 图片上传到云空间
                let servicePic = this.formServicePic;
                let officePic = this.formOfficePic;
                if (servicePic.length > 0 || officePic.length > 0) {
                    uni.showLoading({
                        title: '图片上传中'
                    });
                }
                servicePic = await cloudHelper.transTempPics(servicePic, setting.SETUP_PIC_PATH, '');
                officePic = await cloudHelper.transTempPics(officePic, setting.SETUP_PIC_PATH, '');
                data.servicePic = servicePic;
                data.officePic = officePic;
                await cloudHelper.callCloudSumbit('admin/setup_contact', data).then((res) => {
                    let callback = () => {
                        uni.navigateBack({
                            delta: 0
                        });
                    };
                    pageHelper.showSuccToast('修改成功', 1500, callback);
                });
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        }
    }
};
</script>
<style>
@import './admin_setup_contact.css';
</style>
